import { resolve } from 'path';
import { defineConfig, loadEnv } from 'vite';
import vue from '@vitejs/plugin-vue';
import viteAutoImport from 'unplugin-auto-import/vite';
import Components from 'unplugin-vue-components/vite';
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';

const pathResolve = (dir) => {
  return resolve(__dirname, '.', dir);
};

const alias = {
  '@': pathResolve('./src/'),
};

const viteConfig = defineConfig((mode) => {
  const env = loadEnv(mode.mode, process.cwd());
  return {
    base: mode.VITE_PUBLIC_PATH,
    define: {
      __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: 'false',
    },
    plugins: [
      vue(),
      viteAutoImport({
        // imports: ['vue', 'vue-router'], // 自动导入的组件
        dts: false,
        eslintrc: {
          enabled: true,
          filepath: './.eslintrc-auto-import.json',
        },
        resolvers: [ElementPlusResolver()],
      }),
      Components({
        dts: false,
        resolvers: [ElementPlusResolver()],
      }),
    ],
    resolve: { alias },
    // 预加载的组件
    optimizeDeps: {
      include: [
        'element-plus/es/locale/lang/zh-cn',
        'element-plus/es/locale/lang/en',
        'element-plus/es/locale/lang/zh-tw',
        'element-plus/es/components/config-provider/style/css',
      ],
    },
    build: {
      outDir: 'dist',
      sourcemap: false,
    },
    esbuild: {
      // drop: env.VITE_ENV === 'development' ? ['console', 'debugger'] : [],
    },
    server: {
      host: '0.0.0.0',
      port: env.VITE_PORT,
    },
  };
});

export default viteConfig;
